<template lang="html">
  <d2-container>
    <page-header
      slot="header"
      ref="pageHeader"
      @doSearch="doSearch"
      @doReset="doReset"
      @doAdd="doAdd"
    />

    <!-- 中间内容容器 -->
    <div v-loading="loading" class="loading-wrapper">
      <el-table
        ref="multipleTable"
        border
        stripe
        :data="tableData"
        tooltip-effect="dark"
        style="width: 100%"
      >
        <el-table-column type="index" width="50" label="序号" align="center" />
        <el-table-column prop="taskName" label="名称" align="center" />
        <el-table-column prop="dtName" label="数据源" align="center"/> 
        <el-table-column prop="odsTableName" label="原始数据表名" align="center"/> 
        <el-table-column prop="updateTime" label="更新时间" align="center" width="160" />
        <el-table-column label="操作" align="center" width="180" fixed="right">
          <template slot-scope="{ row }">
            <el-button type="text" @click="doEdit(row)">修改</el-button>
            <el-button type="text" class="danger" @click="doDel(row)">删除</el-button>
            <el-button type="text" @click="doCrontab(row)">定时任务</el-button>
          </template>
        </el-table-column>
      </el-table>
    </div>

    <!-- 添加、修改事项 -->
    <edit-dialog :dialogVisible.sync="editDialogVisible" :taskId="id" :dtOps="dtOps" @success="getTableData" />
    <crontab-dialog :dialogVisible.sync="crontabDialogVisible" :currentRowObj="currentRowObj" />
    <!-- 底部分页 -->
    <footer-page
      slot="footer"
      :pageSize="pageSize"
      :currentPage="currentPage"
      :total="total"
      @handleSizeChange="handleSizeChange"
      @handleCurrentChange="handleCurrentChange"
    />
  </d2-container>
</template>

<script>
import PageHeader from "./components/page-header";
import EditDialog from "./components/edit-dialog";
import CrontabDialog from "./components/crontab-dialog";
import { SelectList} from "api/dtmg/datasource";
import { PageList, DelData} from "api/dtmg/task";
import tableMixinKeepAlive from "mixins/tableMixinKeepAlive";
export default {
  name: "dtmg-task",
  components: {
    PageHeader,
    EditDialog,
    CrontabDialog,
  },
  mixins: [tableMixinKeepAlive],
  data() {
    return {
      multipleSelection: [], 
      // 添加人员draw的开关
      editDialogVisible: false,
      crontabDialogVisible: false,
      // 接口api
      getTableListSyncMethod: PageList,
      // 当前行数据id
      id: "",
      currentRowObj: {},
      dtOps: [],
    };
  },
  async created() { 
    this.dtOps = await SelectList();
  },
  methods: {
    /**
     * 添加
     */
    doAdd() {
      this.id = "";
      this.editDialogVisible = true;
    },
    /**
     * 编辑
     */
    doEdit(row) {
      this.id = row.id;
      this.editDialogVisible = true;
    },
    doCrontab(row) {
      this.currentRowObj = row;
      this.crontabDialogVisible = true;
    },
    /**
     * 删除
     */
    async doDel(row) {
      await this.$myConfirm("删除任务");
      try {
        const { id } = row;
        await DelData(id);
        this.$message.success("数据源删除成功");
        this.backPrePageWhenDelOne();
        this.getTableData();
      } catch (e) {
        console.log(e);
      }
    },
    /**
     * 列表数据格式化
     */
    tableDataFormat(data) {
      data.map((item) => {
        const { dtId } = item;
        item.dtName = this.dtOps.find((dt) => dt.id === dtId)?.dtName;
      });
      return data;
    },
 
  },
};
</script>
